<!-- 唐礼飞  2020-10-26 09:21:27  -->
<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>主界面-网盘</title>
<%@include file="include/css.jsp"%>
<style type="text/css">
.breadcrumb {
	background: none;
}

.breadcrumb-item+.breadcrumb-item::before {
	display: inline-block;
	padding-right: 0.5rem;
	color: #6c757d;
	content: ">";
}

.container-fluid {
	margin-top: 10px;
}

.list-group-item-action {
	border: none;
}
</style>
</head>
<body>
	<%@include file="include/header.jsp"%>
	<div class="container-fluid">
		<div class="row" style="border-bottom: 1px dashed #ccc;">
			<div class="col-md-2 text-center">
				<div class="btn-group btn-group-sm" role="group">
					<button type="button" class="btn btn-secondary">
						<i class="fa fa-arrow-left" aria-hidden="true"></i>
					</button>
					<button type="button" class="btn btn-secondary">
						<i class="fa fa-arrow-right" aria-hidden="true"></i>
					</button>
					<button type="button" class="btn btn-secondary">
						<i class="fas fa-sync-alt"></i>
					</button>
				</div>
			</div>
			<div class="col-md-7">
				<ol class="breadcrumb" style="padding: 0px;">
					<li class="breadcrumb-item" aria-current="page"><i
						class="fas fa-home"></i></li>
					<li class="breadcrumb-item" aria-current="page">全部</li>
				</ol>
			</div>
			<div class="col-md-3">
				<div class="input-group input-group-sm">
					<input type="text" class="form-control" placeholder=""
						aria-label="" aria-describedby="button-addon2">
					<div class="input-group-append">
						<button class="btn btn-outline-secondary" type="button"
							id="button-addon2">
							<i class="fas fa-search"></i>
						</button>
					</div>
				</div>
			</div>
		</div>
		<div class="row" style="margin-top: 5px;">
			<div class="col-md-2" style="border-right: 1px dotted #ccc;">
				<div class="list-group">
					<a href="#" class="list-group-item list-group-item-action active"><i
						class="fas fa-home"></i>&nbsp;全部文件</a> <a href="#"
						class="list-group-item list-group-item-action"><i
						class="fas fa-file"></i>&nbsp;我的文档</a> <a href="#"
						class="list-group-item list-group-item-action"><i
						class="fas fa-image"></i>&nbsp;我的图片</a> <a href="#"
						class="list-group-item list-group-item-action"><i
						class="fas fa-video"></i>&nbsp;我的视频</a> <a href="#"
						class="list-group-item list-group-item-action"><i
						class="fas fa-music"></i>&nbsp;我的音乐</a><a href="#"
						class="list-group-item list-group-item-action"><i
						class="fas fa-passport"></i>&nbsp;其它</a><a href="#"
						class="list-group-item list-group-item-action"><i
						class="fas fa-share-square"></i>&nbsp;我的分享</a><a href="#"
						class="list-group-item list-group-item-action"><i
						class="fas fa-trash-alt"></i>&nbsp;垃圾箱</a>
				</div>
				<div style="margin-top: 30px;">
					<div class="progress">
						<div class="progress-bar" role="progressbar" style="width: 25%;"
							aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">25%</div>
					</div>
					容量：
				</div>
			</div>
			<div class="col-md-10">
				<div class="btn-toolbar justify-content-between" role="toolbar"
					aria-label="Toolbar with button groups">
					<div>
						<a class="btn btn-outline-primary btn-sm" href="javascript:;"
							data-toggle="modal" data-target="#uploadFileModal">
							<i class="fas fa-plus"></i> 上传文件
						</a>
						<a class="btn btn-outline-primary btn-sm" href="javascript:;"
							data-toggle="modal" data-target="#newFolderModal"> <i
							class="fas fa-folder-plus"></i> 新建文件夹
						</a>
						<button type="button" class="btn btn-outline-primary btn-sm">
							<i class="fas fa-trash-alt"></i>删除
						</button>
						<button type="button" class="btn btn-outline-primary btn-sm">
							<i class="fas fa-download"></i>下载
						</button>
						<button type="button" class="btn btn-outline-primary btn-sm">
							<i class="fas fa-edit"></i>重命名
						</button>
						<a class="btn btn-outline-primary btn-sm"
							href="${pageContext.request.contextPath}/main/thumbnail"> <i
							class="fas fa-edit"></i>刷新
						</a>
					</div>
					<div>
						<a class="btn btn-outline-secondary btn-sm"
							href="${pageContext.request.contextPath}/main/list"> <i
							class="fas fa-list-alt fa-lg"></i>
						</a> <a class="btn btn-outline-secondary btn-sm"
							href="${pageContext.request.contextPath}/main/thumbnail"> <i
							class="fas fa-grip-horizontal fa-lg"></i>
						</a>
					</div>
				</div>
				<div style="margin-top: 5px;">
					<div class="row">
						<c:forEach items="${files}" var="f" varStatus="vs">
							<div class="col-md-3" style="margin-top: 10px;">
								<div class="card">
									<c:if test="${f.isDirectory}">
										<i class="far fa-folder-open"></i>
									</c:if>
									<c:if test="${!f.isDirectory}">
										<i class="far fa-file"></i>
									</c:if>
									<div class="card-body">
										<h6 class="card-title">${f.name}</h6>
										<p class="card-text">
											<small class="text-muted">大小：${f.sizeInBytes}&nbsp;B<br />更新时间：<fmt:formatDate
													pattern="yyyy-MM-dd HH:mm:ss" value="${f.lastModified}" />
											</small> ${f.mimeType}
										</p>
									</div>
									<div class="card-footer">
										<div class="text-right">
											<a title="共享" href="#"><i class="fas fa-share-alt-square"></i></a>&nbsp;<a
												title="下载" href=""><i class="fas fa-download"></i></a>&nbsp;<a
												title="重命名" href=""><i class="fas fa-edit"></i></a>&nbsp;<a
												title="删除" href="javascript:del('${f.name}')"><i class="fas fa-trash-alt"></i></a>
										</div>
									</div>
								</div>
							</div>
						</c:forEach>
					</div>
				</div>
			</div>
		</div>
	</div>
	<%@include file="include/js.jsp"%>
	<%@include file="include/change-password.jsp"%>
	<%@include file="include/new-folder.jsp"%>
	<%@include file="include/upload-file-modal.jsp"%>
	<script>
		function del(name){
			if(confirm("此操作将永久性的删除，不可恢复，是否继续？")){
				$.ajax({
					url : "${pageContext.request.contextPath}/delete/file",
					type : "POST",
					data : {
						name:name
					},
					dataType : "json",
					success : function(result) {
						if(result.code===0){
							window.location.href = "${pageContext.request.contextPath}/main/thumbnail";
						}
						alert(result.message);
					},
					error : function(err) {
						alert("删除文件失败！");
						console.log(err);
					}
				});
			}
		}
	</script>
</body>
</html>